<!--
 * @Author: hui.chenn
 * @Description:  退货退款
 * @Date: 2025-02-21 13:19:48
 * @LastEditTime: 2025-02-21 14:23:40
 * @LastEditors: hui.chenn
-->
<template>
    <div id="icsr_demo">
        <div class="text">退款信息</div>
        <base-form :model.sync="model" :form-items="refundMondyItems" :is-form="false"/>

        <div class="text">退货地址</div>
        <base-form :model.sync="model" :form-items="refundGoodItems" :is-form="false"/>

    </div>
  </template>
  
  <script>
  import BaseForm from '../BaseForm/BaseForm.vue';
  const PAYMENT_METHOD = [
    {key: 'BANK',value: '银行转账'},
    {key: 'ALIPAY',value: '支付宝转账'},
    {key: 'JD',value: '京东钱包'},
    {key: 'TIKTOK',value: '抖音小额打款'},
    {key: 'STORE',value: '店铺后台退'}
  ]

  const ASM_RETURN_WAY = [
    {key: 'ON_DOOR',value: '顺丰上门取件'},
    {key: 'MAIL_IN',value: '用户自行寄回'},
    {key: 'ARRIVE_PAID',value: '快递到付'},
  ]

  const options  =  [{
        value: 'zhinan',
        label: '江苏省',
        children: [
            {
                value: 'shejiyuanze',
                label: '苏州市',
                children: [
                    {
                        value: 'yizhi',
                        label: '园区'
                    }, {
                        value: 'fankui',
                        label: '高新区'
                    }, {
                        value: 'xiaolv',
                        label: '吴中区'
                    }, {
                        value: 'kekong',
                        label: '姑苏区'
                    }
                ]
            }, 
            {
                value: 'daohang',
                label: '南通市',
                children: [
                    {
                        value: 'cexiangdaohang',
                        label: '海安'
                    }, {
                        value: 'dingbudaohang',
                        label: '通州区'
                    }
                ]
            }
        ]
    }]
  
  export default {
    name: 'ReceiveRefund',
    components: { 
        BaseForm
     },
    props: {
        value: {
			type: Object,
			default: () => ({})
		}
    },
    data() { 
        return {
            refundMondyItems: [
                {
                    label: '退款方式',
                    prop: 'payType',
                    type: 'select',
                    component: 'el-select',
                    select: PAYMENT_METHOD,
                    style: { width: '100%' },
                    required: true
                },
                {
                    label: '收款人名称',
                    prop: 'collectionAccountName',
                    type: 'text',
                    component: 'el-input',
                    required: true
                },
                {
                    label: '收款账号',
                    prop: 'collectionAccount',
                    type: 'text',
                    component: 'el-input',
                    required: true
                },
                {
                    label: '开户行',
                    prop: 'vatBankAccount',
                    type: 'select',
                    component: 'el-select',
                    select: PAYMENT_METHOD,
                    style: { width: '100%' },
                    required: true
                },
            ],
            refundGoodItems: [
                {
                    label: '退回方式',
                    prop: 'returnWay',
                    type: 'select',
                    component: 'el-select',
                    select: ASM_RETURN_WAY,
                    style: { width: '100%' },
                    required: true
                },
                {
                    label: '预约上门时间',
                    prop: 'onDoorDate',
                    type: 'datetime',
                    component: 'el-date-picker',
                    style: { width: '100%' },
                    required: true
                },
                {
                    label: '用户姓名',
                    prop: 'customerName',
                    type: 'text',
                    component: 'el-input',
                },
                {
                    label: '联系手机',
                    prop: 'customerPhone',
                    type: 'text',
                    component: 'el-input',
                    required: true
                },
                {
                    label: '客户地址',
                    prop: 'cascaderCitys',
                    type: 'cascader',
                    component: 'el-cascader',
                    options: options,
                    style: { width: '100%' }
                },
                {
                    label: '详细地址',
                    prop: 'addDetail',
                    type: 'text',
                    component: 'el-input',
                    required: true
                },
            ]
        }
    },
    computed: {
		model: {
			get() {
				return this.value;
			},
			set(val) {
				this.$emit('input', val);
			}
		}
	},
    mounted() {
      
    },
    methods: {
      
    }
  }
  </script>
  
  <!-- Add "scoped" attribute to limit CSS to this component only -->
  <style scoped>
 .text{
    color: #AEAEAE;
 }
  </style>
  